/* eslint-disable @typescript-eslint/ban-types */
/**
 * 表单组件
 * @param {*} props
 * @param {*} props.visible 是否可视
 * @param {*} props.title 标题
 * @param {*} props.formList 表单项
 * @param {*} props.formValue 表单值
 * @param {*} props.onSave 保存
 * @param {*} props.onCancel 取消
 * @returns
 */
import { Modal } from 'antd';
import React from 'react';
import { FormPanel, type FormPanelObject, FormPanelStatus, FormPanelBtnAlign, FormPanelBtnDisplay } from 'lfun-bg-comp';

type Props = {
  visible: boolean;
  title: string;
  onSave: Function;
  onCancel: Function;
  formList: any;
  formValue?: any;
  changeValue?: Function;
  isEdit?: boolean;
  isReset?: boolean;
};

const FormModel: React.FC<Props> = ({
  visible,
  title = '新增',
  formList,
  formValue,
  changeValue,
  onSave,
  onCancel,
  isEdit = true,
  isReset = true,
}) => {
  const [form, setForm] = React.useState(null);
  const handleCancel = () => {
    if (isReset) form?.resetFields();
    onCancel(false, form);
  };
  return (
    <Modal title={title} width="80%" footer={[]} open={visible} onCancel={handleCancel}>
      <FormPanel
        btnsAlign={FormPanelBtnAlign.center}
        buttonsDisplay={isEdit ? FormPanelBtnDisplay.block : FormPanelBtnDisplay.none}
        formStatus={isEdit ? FormPanelStatus.edit : FormPanelStatus.nonEdit}
        restBtnText="返回"
        submitBtnText="确定"
        onReset={handleCancel}
        onLoad={cntForm => {
          setForm(cntForm);
        }}
        values={formValue}
        onValuesChange={values => changeValue({ ...formValue, ...values })}
        onFinish={async (formPanelObject: FormPanelObject) => {
          await onSave(formPanelObject);
          return false;
        }}
        template={formList}
      />
    </Modal>
  );
};

FormModel.defaultProps = {
  formValue: {}, // 设置默认值
  changeValue: () => {},
  isEdit: true,
  isReset: true,
};

export default FormModel;
